import React from 'react'
import Layout from './Layout';
import { useSelector, useDispatch } from 'react-redux';
import { Button, Form, Input, Result } from "antd"
import { signUpPayload, signUp } from '../../store/actions/auth.action';
import { AppState } from '../../store/reducers';
import { AuthState } from '../../store/reducers/auth.reducer';

const SignUp = () => {
    const auth = useSelector<AppState, AuthState>(state => state.auth)
    
    const dispatch = useDispatch()
    
    // 登录表单提交
    const onFinish = (value: signUpPayload) => {
        // 发送登录请求
        dispatch(signUp(value))
    }
    return <Layout title="注册" subTitle="">
        <Form onFinish={onFinish}>
        <Form.Item name="name" label="名称">
                <Input />
            </Form.Item>
            <Form.Item name="email" label="邮箱">
                <Input />
            </Form.Item>
            <Form.Item name="password" label="密码">
                <Input.Password />
            </Form.Item>
            <Form.Item>
                <Button type="primary" htmlType="submit">
                登录
                </Button>
            </Form.Item>
            </Form>
        </Layout>;

}
export default SignUp;